<!DOCTYPE html>
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
		<title></title>
		<link rel="stylesheet" type="text/css" href="css/bootstrap.css"/>
		<link rel="stylesheet" type="text/css" href="css/idangerous.swiper.css"/>
		<link rel="stylesheet" type="text/css" href="css/style.css"/>
		<link rel="stylesheet" type="text/css" href="css/swiper.min.css"/>
		<script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
		<!--[if lte IE 9]>
		<link rel="stylesheet" type="text/css" href="css/ie.css" media="screen" />
		<script src="https://cdn.bootcss.com/respond.js/1.4.2/respond.js"></script>
		<script src="https://cdn.bootcss.com/html5shiv/r29/html5.js"></script>
		<script src="js/css3-mediaqueries.js"></script>
		<![endif]-->
		<script src="js/bootstrap.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/idangerous.swiper.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/css3-mediaqueries.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/index.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<body>
		<div class="page">
			<p class="active"><span>中心简介</span>01</p>
			<p><span>新闻资讯</span>02</p>
			<p><span>产品展示</span>03</p>
		</div>
		<div class="header">
			<div class="header_pc">
				<div class="menu">menu</div>
				<div class="logo"><a href=""><img src="images/img001.png"/></a></div>
				<div class="nav">
					<div class="nav_top">
						<div class="nav_close"><img src="images/img011.png"/></div>
						<div class="nav_logo"><img src="images/img012.png"/></div>
					</div>
					<ul>
						<li><a href="#">中心简介<br /><i>Company Profile</i></a></li>
						<li><a href="#">新闻资讯<br /><i>News Information</i></a></li>
						<li><a href="#">产品展示<br /><i>Product Display</i></a></li>
						<li><a href="联系我们.html">联系我们<br /><i>Contact Us</i></a></li>
					</ul>
					<div class="nav_box">
						<p class="nav_title">开展国际人才交流合作</p>
						<p class="nav_title">引进海外人才</p>
						<p class="nav_con first">Carry out international talents exchange and cooperation</p>
						<p class="nav_con">Introduction of overseas talents</p>
						<span class="more_box"><a class="more" href="新闻列表.html">welcome</a></span>
						<div class="bj">
							<div class="bj_item"><img src="images/img006.png"/></div>
							<div class="bj_item"><img src="images/img007.png"/></div>
							<div class="bj_item"><img src="images/img008.png"/></div>
							<div class="bj_item"><img src="images/img009.png"/></div>
						</div>
					</div>
				</div>
				<div class="shadow"><img src="images/img013.jpg"/></div>
			</div>
			<div class="header_yd">
				<div class="container">
					<div class="yd_logo col-xs-9 col-sm-10 col-md-10">
						<div class="row"><img src="images/img001.png"/></div>
					</div>
					<div class="yd_menu col-xs-3 col-sm-2 col-md-2">
						<div class="row">
							<span>menu</span>
						</div>
					</div>
				</div>
				<div class="yd_nav">
					<div class="container">
						<div class="nav_logo col-xs-8 col-sm-9 col-md-9">
							<div class="row"><img src="images/img012.png"/></div>
						</div>
						<div class="navs_close col-xs-1 col-sm-3 col-md-3">
							<div class="row"><img src="images/img015.png"/></div>
						</div>
						<div class="list">
							<a href="#zxjj">中心简介<br /><i>Company Profile</i></a>
							<a href="#xwzx">新闻资讯<br /><i>News Information</i></a>
							<a href="#cpzs">产品展示<br /><i>Product Display</i></a>
							<a href="#lxwm">联系我们<br /><i>Contact Us</i></a>
						</div>
						<div class="yd_bj"><img src="images/img006.png"/></div>
					</div>
				</div>
				<div class="banner"><img src="images/img002.jpg"/></div>
			</div>
		</div>
		<div class="content">
			<div class="container">
				<div class="zxjj" id="zxjj">
					<a href="新闻列表.html" class="title">
						<p>中心简介</p>
						<span>company profile</span>
					</a>
					<div class="zxjj_box">
						<div class="zxjj_left col-xs-12 col-sm-12 col-md-12 col-lg-6">
							<div class="zxjj_title">深圳国际人才交流中心是深圳市人民政府于2017年9月批准设立</div>
							<div class="zxjj_con">在科技部（外国专家局）、深圳市政府指导下，由国家外国专家局国外人才信息研究中心、中国国际人才交流中心、深圳市人力资源和社会保障局、宝安区人民政府合作举办的国际人才智力交流合作专门机构宝安区人民政府合作举办的国际人才智力交流合作专门机构 </div>
							<span class="more_box1"><a class="more1" href="">more</a></span>
						</div>
						<div class="zxjj_right col-xs-12 col-sm-12 col-md-12 col-lg-6"><img src="images/img003.jpg"/></div>
					</div>
				</div>
				<div class="xwzx zxjj" id="xwzx">
					<div class="xwzx_box">
						<a href="新闻列表.html" class="title titles">
							<p>新闻资讯</p>
							<span>News information</span>
						</a>
						<div class="hidden-xs hidden-sm hidden-md col-lg-4">
							<a href="详情页.html" class="xwzx_item">
								<img src="images/img004.jpg"/>
								<div class="time col-xs-3 col-sm-3 col-md-3 col-lg-3">
									<div class="row">
										<div class="date">24</div>
										<div class="month">2019.01</div>
									</div>
								</div>
								<div class="xwzx_con col-xs-9 col-sm-9 col-md-9 col-lg-9">
									<div class="row">
										<div class="xwzx_title">意盛集团做为参会单位在全国人才活动周之夜出席盛典</div>
										<div class="xwzx_jj">意盛集团人力资源部在20届国际人才交流大会主办的创意设计大典中获奖</div>
									</div>
								</div>
							</a>
							<div class="clear"></div>
							<span class="more_box1"><a class="more1" href="详情页.html">more</a></span>
						</div>
						<div class="col-xs-12 col-sm-12 col-md-12 col-lg-4">
							<a href="" class="xwzx_item">
								<img src="images/img004.jpg"/>
								<div class="time col-xs-3 col-sm-3 col-md-3 col-lg-3">
									<div class="row">
										<div class="date">24</div>
										<div class="month">2019.01</div>
									</div>
								</div>
								<div class="xwzx_con col-xs-9 col-sm-9 col-md-9 col-lg-9">
									<div class="row">
										<div class="xwzx_title">意盛集团做为参会单位在全国人才活动周之夜出席盛典</div>
										<div class="xwzx_jj">意盛集团人力资源部在20届国际人才交流大会主办的创意设计大典中获奖</div>
									</div>
								</div>
							</a>
							<div class="clear"></div>
							<span class="more_box1"><a class="more1" href="">more</a></span>
						</div>
						<div class="col-xs-12 col-sm-12 col-md-12 col-lg-4">
							<a href="" class="xwzx_item">
								<img src="images/img004.jpg"/>
								<div class="time col-xs-3 col-sm-3 col-md-3 col-lg-3">
									<div class="row">
										<div class="date">24</div>
										<div class="month">2019.01</div>
									</div>
								</div>
								<div class="xwzx_con col-xs-9 col-sm-9 col-md-9 col-lg-9">
									<div class="row">
										<div class="xwzx_title">意盛集团做为参会单位在全国人才活动周之夜出席盛典</div>
										<div class="xwzx_jj">意盛集团人力资源部在20届国际人才交流大会主办的创意设计大典中获奖</div>
									</div>
								</div>
							</a>
							<div class="clear"></div>
							<span class="more_box1"><a class="more1" href="">more</a></span>
						</div>
					</div>
				</div>
				<div class="zxjj cpzs" id="cpzs">
					<a href="新闻列表.html" class="title title2">
						<p>产品展示</p>
						<span>PRODUCT DISPLAY</span>
					</a>
					<div class="cpzs_box">
						<div class="cpzs_item col-xs-6 col-sm-6 col-md-6 col-lg-3">
							<a href="">
								<img src="images/img018.png"/>
								<p class="name">运动腕带</p>
								<p class="price">¥1,080</p>
							</a>
							<div class="shadow_cpzs">
								<p class="name1">运动腕带</p>
								<p class="js">智能健康手腕抓住心脏每一个瞬间</p>
								<p class="price1">¥1,080</p>
								<span class="more_box1"><a class="more1" href="">购买</a></span>
							</div>
						</div>
						<div class="cpzs_item col-xs-6 col-sm-6 col-md-6 col-lg-3">
							<a href="">
								<img src="images/img019.png"/>
								<p class="name">运动腕带</p>
								<p class="price">¥1,080</p>
							</a>
							<div class="shadow_cpzs">
								<p class="name1">运动腕带</p>
								<p class="js">智能健康手腕抓住心脏每一个瞬间</p>
								<p class="price1">¥1,080</p>
								<span class="more_box1"><a class="more1" href="">购买</a></span>
							</div>
						</div>
						<div class="cpzs_item col-xs-6 col-sm-6 col-md-6 col-lg-3">
							<a href="">
								<img src="images/img020.png"/>
								<p class="name">运动腕带</p>
								<p class="price">¥1,080</p>
							</a>
							<div class="shadow_cpzs">
								<p class="name1">运动腕带</p>
								<p class="js">智能健康手腕抓住心脏每一个瞬间</p>
								<p class="price1">¥1,080</p>
								<span class="more_box1"><a class="more1" href="">购买</a></span>
							</div>
						</div>
						<div class="cpzs_item col-xs-6 col-sm-6 col-md-6 col-lg-3">
							<a href="">
								<img src="images/img021.png"/>
								<p class="name">运动腕带</p>
								<p class="price">¥1,080</p>
							</a>
							<div class="shadow_cpzs">
								<p class="name1">运动腕带</p>
								<p class="js">智能健康手腕抓住心脏每一个瞬间</p>
								<p class="price1">¥1,080</p>
								<span class="more_box1"><a class="more1" href="">购买</a></span>
							</div>
						</div>
						<div class="clear"></div>
						<span class="more_box1"><a class="more1" href="">more</a></span>
					</div>
				</div>
				<div class="lxwm zxjj xwzx" id="lxwm">
					<a href="新闻列表.html" class="title titles">
						<p>联系我们</p>
						<span>contact us</span>
					</a>
					<div class="lxwm_box">
						<p class="add"><i>地址：</i><span>中国深圳市宝安区福海街道永和路与荔园路交汇处宝安人才园四楼</span> </p>
						<p class="phone"><i>电话：</i><span>86-0755-81707962</span></p>
						<p class="cz"><i>传真:</i><span>86-0755-81707802</span></p>
						<input class="name" type="text"  placeholder="您的姓名"/>
						<input class="phone" type="text"  placeholder="您的电话"/>
						<input class="email" type="text"  placeholder="您的邮箱"/>
						<textarea name="" rows="" cols="" placeholder="您的留言"></textarea>
						<div class="button">提交</div>
					</div>
				</div>
			</div>
		</div>
		<div class="footer">
			<p>版权所有©中华人民共和国国家外国专家局</p>
			<p>ICP备案序号：粤ICP备17022585</p>
		</div>
	</body>
</html>
<script type="text/javascript">  
    var num;
    function autoRoll() {
        $(document).on("mousewheel DOMMouseScroll", function(e) {
            var delta = (e.originalEvent.wheelDelta && (e.originalEvent.wheelDelta > 0 ? 1 : -1)) || // chrome & ie
                (e.originalEvent.detail && (e.originalEvent.detail > 0 ? -1 : 1)); // firefox
            $(document).off("mousewheel DOMMouseScroll");
            if (delta > 0) {
                // 向上滚
                $(".page .active").prev("p").trigger("click");
                num -= 1;
                if (num < 0) {
                    num = 0;
                }
                //要执行的方法
            } else if (delta < 0) {
                // 向下滚
                 $(".page .active").next("p").trigger("click");
                num += 1;
                if (num > 4) {
                    num = 0;
                }
               //要执行的方法
            }
            //使用setTimeout方法产生一个延时效果，是的每次滑动鼠标滑轮，只执行一次事件方法
            setTimeout(autoRoll, 500);
        });
    }
    autoRoll();
   
    
    $(".nav li a").eq(0).click(function(){
    	$(".nav_close").trigger("click");
    	setTimeout(function(){$(".page p").eq(0).trigger("click");}, 1000);
    })
    $(".nav li a").eq(1).click(function(){
    	$(".nav_close").trigger("click");
    	setTimeout(function(){$(".page p").eq(1).trigger("click");}, 1000);
    })
    $(".nav li a").eq(2).click(function(){
    	$(".nav_close").trigger("click");
    	setTimeout(function(){$(".page p").eq(2).trigger("click");}, 1000);
    })
    
    
window.onload = function(){
	
	
	
	//产品展示
	
	$(".cpzs_item").mouseover(function(){
		var cpWidth = $(".cpzs_item").width();
		var imgHeight = $(".cpzs_item img").height();
		var imgWidth = $(".cpzs_item img").width();
		var shadowLeft = ((cpWidth -imgWidth)/2)+15;
		$(this).children(".shadow_cpzs").css("left",shadowLeft);
		$(this).children(".shadow_cpzs").stop().animate({"height":imgHeight+"px"},500);
	})
	
	var imgWidth = $(".cpzs_item img").width();
	$(".shadow_cpzs").css("width",imgWidth);
	var cpWidth = $(".cpzs_item").width();
	var shadowLeft = ((cpWidth -imgWidth)/2)+15;
	$(".shadow_cpzs").css("left",shadowLeft);
	
	$(".cpzs_item").mouseleave(function(){
		$(this).children(".shadow_cpzs").stop().animate({"height":"0px"},500);
	})
	
	
	
	//联系我们跳页面
	var hash=window.location.hash;
	var _index = +hash.substring(1);
	if(_index){
		$(".page p").eq(_index).trigger("click");
	}
	
	$(".menu").trigger("click");
}

    
</script> 